<template>
	<view id="voteRecordDetail">
		
		<view class="vote-cont">
			<view class="vote-title">
				{{voteDetailInfo.community_name}}首次成立业主大会申请
			</view>
			<view class="vote-wrap">
				<view class="vote-item">
					<view class="agree">已同意人数</view>
					<view class="person-num"><text style="color: #427705;"> {{voteDetailInfo.secondedTotal}}人
						</text> {{voteDetailInfo.ratioStr}}</view>
					<view class="person-assets">
						<view style="text-align: center;">
							<view class="person-txt">总户数</view>
							<view class="person-number">{{voteDetailInfo.household_total}} 户</view>
						</view>
						<view class="line"></view>
						<view style="text-align: center;">
							<view class="person-txt">小区面积</view>
							<view class="person-number">{{voteDetailInfo.community_areass}} 平方米</view>
						</view>
					</view>
				</view>
				
				<view class="vote-item1">
					<view class="person-assets">
						<view style="text-align: center;">
							<view class="person-txt">发起人</view>
							<view class="person-number">{{voteDetailInfo.full_name}}</view>
						</view>
						<view class="line" style="margin:0 40rpx"></view>
						<view style="text-align: center;">
							<view class="person-txt">发起人楼号</view>
							<view class="person-number">{{voteDetailInfo.building_number}}</view>
						</view>
						<view class="line" style="margin:0 40rpx"></view>
						<view style="text-align: center;">
							<view class="person-txt">电话</view>
							<view class="person-number">{{voteDetailInfo.telephone}}</view>
						</view>
					</view>
				</view>
				
				<view class="vote-bottom-txt">
					发起时间：{{voteDetailInfo.secondingTime}}
				</view>
				<view class="vote-bottom-txt" v-if="agreeTime && agreeTime != 'undefined' ">
					同意时间：{{agreeTime}}
				</view>
				
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				voteId : null,
				voteDetailInfo: {}, //表决详情
				voteSetInfo: {}, //表决设置信息
				agreeTime : null,//同意时间
			}
		},
		onLoad(option){
			this.voteId = option.id
			this.agreeTime = option.time
		},
		mounted(){
			this.getVoteDetailInfoById();
		},
		methods: {
			getVoteDetailInfoById() {
				this.$requestYz.api.getVoteDetailInfo({
					id: this.voteId,
					selectPassNumber: 1
				}).then(res => {
					if (res.data.data.voteInfo) {
						this.voteDetailInfo = res.data.data.voteInfo;
					}
					//后台设置信息
					if (res.data.data.voteSet) {
						this.voteSetInfo = res.data.data.voteSet;
					}
				})
			},
		},
	}
</script>

<style lang="scss">
	#voteRecordDetail{
		background: #f4f4f4;
		height: 100vh;
		.vote-title{
			font-size: 36rpx;
			font-weight: bold;
			margin: 50rpx auto;
			text-align: center;
			padding-top: 52rpx;
		}
		.vote-wrap{
			margin: 20rpx 30rpx;
			.vote-item{
				width: 700rpx;
				height: 300rpx;
				background: #FFFFFF;
				border-radius: 6px;
				.agree{
					color: #999;
					font-size: 24rpx;
					text-align: center;
					padding: 34rpx 8rpx;
				}
				
			}
			.person-num{
				text-align: center;
				font-size: 40rpx;
				font-weight: bold;
			}
			.person-assets{
				display: flex;
				justify-content: center;
				align-items: center;
				margin-top: 40rpx;
			}
			.person-txt{
				color: #999;
			}
			.person-number{
				font-weight: bold;
				font-size: 16px;
				margin-top: 8rpx;
			}
			.line{
				width: 1px;
				height: 48rpx;
				background: #eee;
				margin: 0 126rpx;
			}
			.vote-item1{
				width: 700rpx;
				height: 160rpx;
				background: #FFFFFF;
				border-radius: 6px;
				margin-top: 40rpx;
				padding-top: 4rpx;
			}
			
			.vote-bottom-txt{
				color:#999;
				font-size: 28rpx;
				text-align: center;
				font-weight: bold;
				margin-top: 30rpx;
			}
			
		}
	}
</style>